<template>
  <div class="right-main">
    <div class="tob-bar">
      <el-breadcrumb separator=">">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>商保方案</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="mainContainer BusinessListPage">
      <div class="table-serch-bar">
        <el-form ref="form" :inline="true" :model="form" size="medium">
          <el-form-item label="公司名称">
            <CompanySelect :p_value.sync="form.companyId"></CompanySelect>
          </el-form-item>
          <product label-name="方案" :p_value.sync="form.productId"></product>
          <el-form-item label="状态">
            <el-checkbox v-model="discount">启用</el-checkbox>
            <el-checkbox v-model="discount2">停用</el-checkbox>
          </el-form-item>
          <el-form-item>
            <el-button type="success" @click="onSubmit">查询</el-button>
          </el-form-item>
        </el-form>
      </div>
      <el-table
        @selection-change="handleSelectionChange"
        class="my-table"
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        :default-sort="{prop: 'date', order: 'descending'}"
      >
        <el-table-column width="55" align="center" type="selection"></el-table-column>
        <el-table-column min-width="90" align="center" type="index" label="序号"></el-table-column>
        <el-table-column min-width="160" align="center" prop="productCode" label="方案编号"></el-table-column>
        <el-table-column min-width="240" align="center" prop="name" label="方案名称"></el-table-column>
        <el-table-column min-width="240" align="center" prop="optrCompName" label="服务公司"></el-table-column>
        <el-table-column min-width="200" align="center" prop="startDate" label="合同期限">
          <template slot-scope="scope">
            <span>{{scope.row.startDate}} - {{scope.row.endDate}}</span>
          </template>
        </el-table-column>
        <el-table-column min-width="160" align="center" prop="value5" label="采购价格">
          <template slot-scope="scope">
            <span>{{scope.row.minP==null?scope.row.minP:0}} - {{scope.row.maxP}}</span>
          </template>
        </el-table-column>
        <el-table-column min-width="90" align="center" prop="cycleCode" label="保险周期">
          <template slot-scope="scope">
            <span>{{scope.row.cycleCode === "1" ? '年':'月'}}</span>
          </template>
        </el-table-column>
        <el-table-column min-width="90" align="center" prop="status" label="状态">
          <template slot-scope="scope">
            <span
              :class="scope.row.status === 0 ? 'text-danger' : 'text-dafult'"
              disable-transitions
            >{{scope.row.status===0?'禁用':'启用'}}</span>
          </template>
        </el-table-column>
      </el-table>
      <div class="table-tools clearfix">
        <div class="fl">
          <el-button type="default" icon="iconfont iconview" size="medium" @click="viewBusiness">查看</el-button>
          <el-button type="default" icon="iconfont iconadd" size="medium" @click="addBusiness">添加</el-button>
          <el-button type="default" icon="iconfont iconedit" size="medium" @click="editBusiness">编辑</el-button>
          <el-button type="default" icon="iconfont icondelet1" size="medium" @click="delet">删除</el-button>
        </div>
        <div class="pagination fr">
          <div class="block">
            <el-pagination
              @current-change="handleCurrentChange"
              :current-page.sync="currentPage3"
              :page-size="pageSize"
              layout="prev, pager, next, jumper"
              :total="total"
            ></el-pagination>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Http from "../../libs/http.js";
import CompanySelect from "../../components/CompanySelect";
import product from "../../components/Product";

export default {
  name: "businessList",
  components: { CompanySelect, product },
  data() {
    return {
      tableData: [],
      selected: [],
      total: 0,
      pageSize: 10,
      currentPage3: 1,
      form: {
        companyId: "",
        productId: ""
      },
      discount: true,
      discount2: true
    };
  },
  created() {
    this.getList();
  },
  methods: {
    test: function() {
      Http.api.get("/serverstatus").then(res => {});
    },
    handleCurrentChange(val) {
      this.getList();
    },
    onSubmit() {
      this.getList();
    },
    // 删除提示
    delet() {
      this.$confirm("确定要删除该方案吗？", "提示", {
        confirmButtonText: "删除",
        cancelButtonText: "取消",
        type: "warning",
        customClass: "custom-modal",
        iconClass: "no-icon",
        center: true
      })
        .then(() => {
          let ids = new Array();
          this.selected.forEach(e => {
            ids.push(e.id);
          });
          Http.api
            .post("/insure/del", { ids: ids })
            .then(res => {
              this.$message({
                type: "success",
                message: "已删除"
              });
              this.selected.forEach(e => {
                this.tableData.splice(this.tableData.indexOf(e), 1);
              });
            })
            .catch(error => {
              this.$alert(error.msg, "提示", {
                confirmButtonText: "确定",
                customClass: "custom-modal",
                iconClass: "no-icon",
                showCancelButton: "flase",
                showCancelButton: false,
                type: "warning",
                center: true
              });
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 查看
    viewBusiness() {
      if (this.selected.length != 1) {
        this.$message.error("请选择一条数据查看");
        return;
      } else {
        this.$router.push({
          path: "/business/view",
          query: { id: this.selected[0].id }
        });
      }
    },
    //添加
    addBusiness() {
      this.$router.push({ path: "/business/add" });
    },
    //添加
    editBusiness() {
      if (this.selected.length != 1) {
        this.$message.error("请选择一条数据查看");
        return;
      } else {
        this.$router.push({
          path: "/business/edit",
          query: { id: this.selected[0].id }
        });
      }
    },
    initGetListParam: function() {
      let param = new Object();
      let statusList = new Array();
      if (this.discount) {
        statusList.push(1);
      }
      if (this.discount2) {
        statusList.push(0);
      }
      param.page = this.currentPage3;
      param.pageSize = this.pageSize;
      param.companyId = this.form.companyId;
      param.productId = this.form.productId;
      param.statusList = statusList;
      return param;
    },
    getList() {
      let param = this.initGetListParam();
      Http.api.post("insure/search", param).then(res => {
        this.total = res.data.total;
        this.tableData = res.data.content;
      });
    },
    handleSelectionChange: function(val) {
      this.selected = val;
    }
  }
};
</script>

